<template>

<div class="module-card-wrapper">
    <div class="m-card-header">
        <slot name="title">
            <span>{{ title }}</span>
        </slot>
    </div>
    <div class="m-card-body">
        <slot name="content">

        </slot>
    </div>
</div>
</template>
<script setup>
    const props = defineProps({
        title: {
            type: String,
            default: '标题'
        }
    })
</script>
<style scoped lang='scss'>
.module-card-wrapper {
    width: 100%;
    display: flex;
    flex-direction: column;
    border: 0.5px solid #f0f0f0;
    border-left: none;
    border-right: none;
    .m-card-header {
        background-color: #f6f6f7;
        height: 40px;
        line-height: 40px;
        padding: 0 20px;
        font-size: 14px;
        border-bottom: 0.5px solid #f0f0f0;
        box-sizing: border-box;
    }
    .m-card-body {
        flex: 1;
        padding: 20px 20px;
    }
}
</style>
